<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>时间</title>
		<meta name="viewport" content="width=device-width,initial-scale=1.0">
		<link rel="stylesheet" type="text/css" href="../css/common.css"/>
		<link rel="stylesheet" type="text/css" href="../css/mobiscroll.jquery.min.css"/>
	</head>
	<style type="text/css">
		.mbsc-dt .mbsc-fr-c{display: flex;}
		/*.mbsc-sc-whl-gr-c{flex: 1;}*/
		.mbsc-fr-btn0{color: red !important;}
		.mbsc-fr-btn1{color: #ccc !important;}
	</style>
	<body>
		<p style="display: flex;justify-content: space-between;padding: 3%;">
			<span class="date1" id="time1">单选</span>
			<span class="date1" id="time2">时间</span>
		</p>
			
			

	</body>
</html>
<script src="../js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../js/dlc.js" type="text/javascript" charset="utf-8"></script>
<script src="../js/mobiscroll.jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">

	   	$('#time1').mobiscroll().scroller({
	       theme: 'ios',
	     	wheels:[
	     		[{
	     			data:['0', '1', '2', '3', '4', '5', '6', '7']
	     		}]
	     	],
	     	display: 'bottom',
	     	headerText:'城市',
	     	lang: 'zh',
	       onBeforeClose: function (event, inst) {
	           if (event.button == 'set') {

	               console.log(event.valueText)

	           } else {
	
	           }
	       }
	
	   });


$('#time2').mobiscroll().datetime({
	       theme: 'ios',
	      headerText:'时间',
	       display: 'bottom',
	       //max:new Date(new Date().getFullYear(), new Date().getMonth(), new Date().getDate()+3),
	       min:new Date(),
	       lang: 'zh',
			//steps: { minute: 5},
			dateFormat:'yymdd',
	       //dateWheels: '|yyMMdd|' ,
	       timeFormat:'HH:ii',
	       returnFormat:'jsdate',
	       //closeOnOverlayTap: false,
	       onBeforeClose: function (event, inst) {
	           if (event.button == 'set') {

	               console.log(event.valueText)

	           } else {
	
	           }
	       }
	
	   });
</script>